<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/commons/global.jsp"%>

<table id="videoList" style="height: 100%; width: 100%;">

</table>

<div id="videoListToolBars" style="height: auto">
	<a href="javascript:void(0)" class="easyui-linkbutton"
		data-options="iconCls:'icon-add',plain:true"
		onclick="videoList_append()">添加</a>|<a href="javascript:void(0)"
		class="easyui-linkbutton"
		data-options="iconCls:'icon-edit',plain:true"
		onclick="videoList_edit()">编辑</a> | <a href="javascript:void(0)"
		class="easyui-linkbutton"
		data-options="iconCls:'icon-undo',plain:true"
		onclick="videoList_undo()">取消</a>| <a href="javascript:void(0)"
		class="easyui-linkbutton"
		data-options="iconCls:'icon-save',plain:true"
		onclick="videoList_accept()">保存</a>| <a href="javascript:void(0)"
		class="easyui-linkbutton"
		data-options="iconCls:'fa fa-cog',plain:true"
		onclick="videoPageRecommendVideoList_add()">推荐</a>| <a
		href="javascript:void(0)" class="easyui-linkbutton"
		data-options="iconCls:'fa fa-cog',plain:true"
		onclick="videoList_categoryListPage()">设置分类</a>|<a
		href="javascript:void(0)" class="easyui-linkbutton"
		data-options="iconCls:'fa fa-cog',plain:true"
		onclick="videoList_tagListPage()">设置标签</a> |<input
		id="videoList_StatusQue" style="width: 100px;" /> |<input
		id="videoList_ProgressStatusQue" style="width: 100px;" /> |<input
		id="videoTitleQue" style="width: 200px;" />
</div>


<script type="text/javascript">
	function videoPageRecommendVideoList_add() {
		var videoSelect = videoListDatagrid.datagrid('getSelected');
		if (videoSelect) {
			$.messager.confirm('确认对话框', '确定推荐吗?', function(r) {
				if (r) {
					var _Data = {
						itemType : 1,
						itemId : videoSelect.id
					};
					
					$.ajax({
						data : _Data,
						async : false,
						url : baseUrl + '/recommend/add',
						success : function(data) {
							if (data.responseCode == '000') {
								$.messager.alert('提示', '推荐成功', 'info');
							} else {
								$.messager.alert('提示', data.responseMessage,
										'error');
							}
						}
					});
				}
			});
		}
	}

	function videoListDatagridReload() {
		try {
			var queryParams = {
				isEntity : true,
				like_title : videoTitleQue.textbox('getValue'),
				status : videoList_StatusQue.combobox('getValue'),
				progressStatus : videoList_ProgressStatusQue
						.combobox('getValue')
			};
			videoListDatagrid.datagrid("options").queryParams = queryParams;
			videoListDatagrid.datagrid("reload");
		} catch (e) {
		}
	}
</script>

<script type="text/javascript">
	var videoList_ProgressStatusQue = undefined;
	var videoList_StatusQue = undefined;
	var videoTitleQue = undefined;
	var videoSelectIndex = undefined;
	var videoSelectRow = undefined;
	var videoEditIndex = undefined;
	var videoEditRow = undefined;
	var videoListDatagrid = undefined;
	$(function() {

		videoList_ProgressStatusQue = $('#videoList_ProgressStatusQue')
				.combobox({
					data : [ {
						"progressStatusCode" : 0,
						"progressStatusMsg" : "全部进度",
						"selected" : true
					}, {
						"progressStatusCode" : 1,
						"progressStatusMsg" : "连载中"
					}, {
						"progressStatusCode" : 2,
						"progressStatusMsg" : "已完结"
					} ],
					valueField : 'progressStatusCode',
					textField : 'progressStatusMsg',
					onChange : function(newValue, oldValue) {
						videoListDatagridReload();
					}
				});

		videoList_StatusQue = $('#videoList_StatusQue').combobox({
			data : [ {
				"statusCode" : 0,
				"statusMsg" : "全部状态",
				"selected" : true
			}, {
				"statusCode" : 1,
				"statusMsg" : "已发布"
			}, {
				"statusCode" : 2,
				"statusMsg" : "已下线"
			}, {
				"statusCode" : 3,
				"statusMsg" : "待发布"
			} ],
			valueField : 'statusCode',
			textField : 'statusMsg',
			onChange : function(newValue, oldValue) {
				videoListDatagridReload();
			}
		});

		videoTitleQue = $('#videoTitleQue').textbox({
			buttonText : '标题搜索',
			buttonIcon : 'icon-search',
			buttonAlign : 'right'
		});

		videoTitleQue.textbox('button').click(function() {
			videoListDatagridReload();
		});

		videoListDatagrid = $('#videoList')
				.datagrid(
						{
							url : '${baseUrl}/video/list',
							pagination : true,
							sortName : 'sort,updateTime',
							sortOrder : 'desc,desc',
							multiSort : true,
							//remoteSort : false,
							// 			rownumbers : true,
							queryParams : {
								isEntity : true
							},
							singleSelect : true,
							idField : 'id',
							striped : true,
							pageSize : 20,
							fitColumns : true,
							toolbar : '#videoListToolBars',
							// 							rowStyler : function(index, row) {
							// 								if (row.statusCode == 1) {
							// 									return 'background-color:#B3EE3A;color:#FCFCFC;';
							// 								} else if (row.statusCode == 2) {
							// 									return 'background-color:#F0E68C;color:#FCFCFC;';
							// 								} else if (row.statusCode == 3) {
							// 									return 'background-color:#E8E8E8;color:#FCFCFC;';
							// 								}
							// 							},
							onLoadSuccess : function() {
								videoSelectIndex = undefined;
								videoSelectRow = undefined;
								videoEditIndex = undefined;
								videoEditRow = undefined;
							},
							onBeforeSelect : function(index, row) {
								if (videoEditIndex != undefined) {
									return false;
								} else {
									videoSelectIndex = index;
									videoSelectRow = row;
								}
							},
							onBeforeEdit : function(index, row) {
								if (videoEditIndex == undefined) {
									videoEditIndex = index;
									videoEditRow = row;
								}
							},
							onEndEdit : function(index, row, changes) {
								var _ed = $(this).datagrid('getEditor', {
									index : index,
									field : 'statusCode'
								});
								row.statusMsg = $(_ed.target).combobox(
										'getText');

								var _progressStatusCodeEd = $(this).datagrid(
										'getEditor', {
											index : index,
											field : 'progressStatusCode'
										});
								row.progressStatusMsg = $(
										_progressStatusCodeEd.target).combobox(
										'getText');
							},
							// 			nowrap : false,
							columns : [ [
									{
										field : 'cover_url',
										title : '封面',
										width : 100,
										align : 'center',
										formatter : function(value, row, index) {
											if (row.coverUrl) {
												var img = '<img src="'
														+ row.coverUrl
														+ '" style="width:103%;height:100px;"/>';
												return img;
											} else {
												return value;
											}
										}
									},
									{
										field : 'id',
										title : 'ID',
										align : 'center',
										width : 60
									},
									{
										field : 'title',
										title : '标题',
										width : 249,
										editor : {
											type : 'text',
											options : {
												required : true
											}
										}
									},
									{
										field : 'sources',
										title : '资源',
										align : 'center',
										width : 100
									},
									{
										field : 'skey',
										title : '资源令牌',
										width : 100,
										align : 'center',
										hidden : true
									},
									{
										field : 'createTime',
										title : '创建时间',
										width : 100,
										align : 'left'
									},
									{
										field : 'updateTime',
										title : '更新时间',
										width : 100,
										align : 'left',
										sortable : true
									},
									{
										field : 'createUser',
										title : '创建者',
										width : 60,
										align : 'center',
										formatter : function(value, row, index) {
											if (row.createUser) {
												return row.createUser.nickname;
											} else {
												return value;
											}
										}
									},
									{
										field : 'entity',
										title : '视频实体',
										width : 80,
										align : 'center',
										formatter : function(value, row, index) {
											return value;
										}
									},
									{
										field : 'parent',
										title : '所属视频集合',
										width : 249,
										align : 'left',
										formatter : function(value, row, index) {
											if (row.parent) {
												return "<span>集合ID:"
														+ row.parent.id
														+ "</span><br/><span>集合标题:"
														+ row.parent.title
														+ "</span>";
											} else {
												return value;
											}
										}
									},
									{
										field : 'sort',
										title : '排序',
										width : 60,
										align : 'center',
										sortable : true,
										editor : {
											type : 'numberbox',
											options : {
												min : 0,
												precision : 2,
												required : true
											}
										}
									},
									{
										field : 'summary',
										title : '简介',
										width : 100,
										align : 'left',
										editor : {
											type : 'textarea'
										}
									},
									{
										field : 'info',
										title : '详细介绍',
										width : 100,
										align : 'left',
										editor : {
											type : 'textarea'
										}
									},
									{
										field : 'playtime',
										title : '播放时间(秒)',
										width : 100,
										align : 'center',
										editor : {
											type : 'numberbox',
											options : {
												min : 0,
												required : true
											}
										}
									},
									{
										field : 'statusCode',
										title : '状态',
										width : 80,
										align : 'center',
										formatter : function(value, row, index) {
											var statusCodeSpan = '<span style="';
											if (row.statusCode == 1) {
												statusCodeSpan += 'color:#6B8E23;font-size:13px;font-weight:600;';
											} else if (row.statusCode == 2) {
												statusCodeSpan += 'color:#8B4726;font-size:13px;font-weight:600;';
											} else if (row.statusCode == 3) {
												statusCodeSpan += 'color:#104E8B;font-size:13px;font-weight:600;';
											}
											return statusCodeSpan += '">'
													+ row.statusMsg + '</span>';
										},
										editor : {
											type : 'combobox',
											options : {
												valueField : 'statusCode',
												textField : 'statusMsg',
												data : [ {
													statusCode : 1,
													statusMsg : '已发布'
												}, {
													statusCode : 2,
													statusMsg : '已下线'
												}, {
													statusCode : 3,
													statusMsg : '待发布'
												} ],
												required : true
											}
										}
									},
									{
										field : 'progressStatusCode',
										title : '进度',
										width : 80,
										align : 'center',
										formatter : function(value, row, index) {
											var statusCodeSpan = '<span style="';
											if (row.progressStatusCode == 2) {
												statusCodeSpan += 'color:#6B8E23;font-size:13px;font-weight:600;';
											} else if (row.progressStatusCode == 1) {
												statusCodeSpan += 'color:#FFEC8B;font-size:13px;font-weight:600;';
											}
											return statusCodeSpan += '">'
													+ row.progressStatusMsg
													+ '</span>';
										},
										editor : {
											type : 'combobox',
											options : {
												valueField : 'statusCode',
												textField : 'statusMsg',
												data : [ {
													statusCode : 1,
													statusMsg : '连载中'
												}, {
													statusCode : 2,
													statusMsg : '已完结'
												} ],
												required : true
											}
										}
									} ] ],
							onDblClickRow : function(index, row) {
								$.ajax({
									data : {
										id : row.id
									},
									async : false,
									url : baseUrl + '/video/info.html',
									success : function(html) {
										$('body').append(html);
									}
								});

							}
						});

		videoListDatagrid.datagrid('getPager').pagination(
				{
					buttons : [ {
						iconCls : 'fa fa-2x fa-location-arrow',
						handler : function() {
							videoListDatagrid.datagrid('gotoPage',
									videoListDatagrid.datagrid('getPager')
											.find('.pagination-num').val());
						}
					} ]
				});

	});

	function videoList_append() {

		$.ajax({
			url : baseUrl + '/video/add/page.html',
			success : function(html) {
				$('body').append(html);
			}
		});
	}
	function videoList_edit() {

		var videoSelect = videoListDatagrid.datagrid('getSelected');
		if (videoEditIndex != undefined && videoEditIndex != videoSelectIndex) {
			$.messager.alert('提示', '请完成已开启编辑行', 'warning');
			return;
		}

		if (videoSelect) {
			if (videoSelectIndex == undefined) {
				videoSelectIndex = videoListDatagrid.datagrid("getRowIndex",
						videoSelect);
			}

			videoListDatagrid.datagrid('beginEdit', videoSelectIndex);
			videoSelectRow = videoSelect;
		}
	}

	function videoList_undo() {
		if (videoSelectIndex != undefined) {
			videoListDatagrid.datagrid('rejectChanges');
			videoSelectIndex = undefined;
			videoSelectRow = undefined;
			videoEditIndex = undefined;
			videoEditRow = undefined;
		}
	}

	function videoList_accept() {
		if (videoSelectIndex != undefined) {
			if (videoListDatagrid.datagrid('validateRow', videoSelectIndex)) {

				//验证发布状态
				var _edStatusCode = videoListDatagrid.datagrid('getEditor', {
					index : videoSelectIndex,
					field : 'statusCode'
				});
				var _statusMsg = $(_edStatusCode.target).combobox('getText');
				if (_statusMsg != '已发布' && _statusMsg != '待发布'
						&& _statusMsg != '已下线') {
					$.messager.alert('提示', '未知状态', 'warning');
					return;
				}

				//验证进度状态
				var _edProgressStatusCode = videoListDatagrid.datagrid(
						'getEditor', {
							index : videoSelectIndex,
							field : 'progressStatusCode'
						});
				var _progressStatusMsg = $(_edProgressStatusCode.target)
						.combobox('getText');
				if (_progressStatusMsg != '连载中' && _progressStatusMsg != '已完结') {
					$.messager.alert('提示', '未知进度', 'warning');
					return;
				}

				//验证标题
				var _edTitle = videoListDatagrid.datagrid('getEditor', {
					index : videoSelectIndex,
					field : 'title'
				});

				var _Title = $(_edTitle.target).val();
				if (!_Title || _Title.trim() == '') {
					$.messager.alert('提示', '标题不能为空', 'warning');
					return;
				}

				//获取简介
				var _edSummary = videoListDatagrid.datagrid('getEditor', {
					index : videoSelectIndex,
					field : 'summary'
				});

				var _Summary = $(_edSummary.target).val();

				//获取详情
				var _edInfo = videoListDatagrid.datagrid('getEditor', {
					index : videoSelectIndex,
					field : 'info'
				});

				var _Info = $(_edInfo.target).val();
				//获取排序
				var _edSort = videoListDatagrid.datagrid('getEditor', {
					index : videoSelectIndex,
					field : 'sort'
				});

				var _Sort = $(_edSort.target).val();

				//获取播放时间
				var _edPlaytime = videoListDatagrid.datagrid('getEditor', {
					index : videoSelectIndex,
					field : 'playtime'
				});

				var _Playtime = $(_edPlaytime.target).val();

				var _Data = {
					id : videoSelectRow.id,
					title : _Title,
					sort : _Sort,
					playtime : _Playtime,
					summary : _Summary,
					info : _Info,
					status : $(_edStatusCode.target).combobox('getValue'),
					progressStatus : $(_edProgressStatusCode.target).combobox(
							'getValue')
				};

				$.ajax({
					data : _Data,
					async : false,
					type : 'POST',
					url : baseUrl + '/video/update',
					success : function(data) {
						if (data.responseCode == '000') {
							videoListDatagrid.datagrid('endEdit',
									videoSelectIndex);

							videoListDatagrid.datagrid('acceptChanges');

							videoSelectIndex = undefined;
							videoSelectRow = undefined;
							videoEditIndex = undefined;
							videoEditRow = undefined;

							$.messager.alert('提示', '修改成功', 'info');
						} else {
							$.messager.alert('提示', data.responseMessage,
									'error');
						}
					}
				});

			}
		}
	}

	function videoList_categoryListPage() {
		var videoSelect = videoListDatagrid.datagrid('getSelected');
		if (videoSelect) {
			$.ajax({
				data : {
					itemId : videoSelect.id,
					itemType : 1
				},
				async : false,
				url : baseUrl + '/category/set.html',
				success : function(html) {
					$('body').append(html);
				}
			});
		}
	}

	function videoList_tagListPage() {

		var videoSelect = videoListDatagrid.datagrid('getSelected');
		if (videoSelect) {
			$.ajax({
				data : {
					itemId : videoSelect.id,
					itemType : 1
				},
				async : false,
				url : baseUrl + '/tag/set.html',
				success : function(html) {
					$('body').append(html);
				}
			});
		}
	}
</script>


<script type="text/javascript">
	function setHeight() {
		//				var c = $('#cc');
		//				var p = c.layout('panel', 'center'); // get the center panel
		//				var oldHeight = p.panel('panel').outerHeight();
		//				p.panel('resize', {
		//					height: 'auto'
		//				});
		//				var newHeight = p.panel('panel').outerHeight();
		//				c.layout('resize', {
		//					height: (c.height() + newHeight - oldHeight)
		//				});
	}
</script>

